layui.use(['form', 'table', 'laypage'], function () {
    var form = layui.form,
        table = layui.table,
        laypage = layui.laypage;
    let vm = new Vue({
        el: "#dd",
        data: {
            mno: "",
            mrole: "",
            login_success: "",
            mroleArr: [{roleId: 0, roleName: "一般管理员"}, {roleId: 1, roleName: "超级管理员"}]
        },
        methods: {
            searchTable() {
                reloadTable(0, 10);
            }
        }
    })


    function getMid() {
        return JSON.parse(sessionStorage.getItem("manageInfo")).mid;
    }
    function getMRole() {
        return JSON.parse(sessionStorage.getItem("manageInfo")).mrole;
    }

    function reloadTable(page, size) {
        let that = vm.$data;
        var mid = getMid();
        console.log(vm);
        if (undefined == that.mno || "" == that.mno || null == that.mno) {
            that.mno = "null";
        }
        if (undefined == that.mrole || "" == that.mrole || null == that.mrole) {
            that.mrole = "null";
        }
        if (undefined == that.login_success || "" == that.login_success || null == that.login_success) {
            that.login_success = "null";
        }
        $.ajax({
            url: '/future/manager/manageTableList/' + mid + '/' + that.mno + '/' + that.mrole + '/' + that.login_success + '/' + page + '/' + size,
            dataType: "json",
            success: function (res) {
                if (res.code == "10101") {
                    sessionStorage.setItem("manageInfo", null);
                    window.parent.location.reload();
                    return false;
                }
                if (that.mno == "null") {
                    that.mno = "";
                }
                console.log("返回数据---", res);
                table.render({
                    elem: '#currentTableId',
                    toolbar: '#toolbar',
                    defaultToolbar: ['filter', 'exports', 'print', {
                        title: '提示',
                        layEvent: 'LAYTABLE_TIPS',
                        icon: 'layui-icon-tips'
                    }],
                    data: res.pageInfo.list,
                    cols: [[
                        {type: "numbers", title: "序号"},
                        {type: "checkbox", width: "10%"},
                        {field: 'mno', width: "10%", title: '账号'},
                        {
                            field: 'mrole', width: "10%", title: '级别', templet(d) {
                                if (d.mrole == 0) {
                                    return '普通管理员';
                                } else {
                                    return '超级管理员';
                                }
                            }
                        },
                        {
                            field: 'login_success', width: "10%", title: '在线状态', templet(d) {
                                if (d.login_success == 0) {
                                    return '离线';
                                } else if (d.login_success == 1) {
                                    return '在线';
                                }
                            }
                        },
                        {
                            field: 'lastlogintime', width: "10%", title: '登录时间',templet(d) {
                                if (d.loginlasttime != "") {
                                    let ns = new Date(d.lastlogintime).getTime() / 1000
                                    return new Date(parseInt(ns) * 1000).toLocaleString().replace(/:\d{1,2}$/, ' ');
                                }
                            }
                        },
                        {field: 'loginarea', title: '登录地', width: "20%"},
                        {field: 'loginip', width: "10%", title: '登录IP'},
                        {title: '操作', width: "20%", toolbar: '#currentTableBar', align: "center"}
                    ]],
                    done: function (e) {
                        console.log("分页---", e);
                        laypage.render({
                            elem: 'page', //注意，这里的 page 是 ID，不用加 # 号
                            count: e.count, //数据总数，从服务端得到
                            curr: page,
                            limit: size, // 每页条数
                            prev: "<<",
                            next: ">>",
                            theme: "#0099ff",
                            layout: ['count', 'prev', 'page', 'next'],
                            skip: true,
                            jump(obj, first) {
                                if (!first) {
                                    reloadTable(obj.curr, 10);//查询当页数据
                                }
                            }
                        });
                    },
                    page: false,
                });
                form.render();
            }

        })

    }


    table.on('toolbar(currentTableId)', function (obj) {
        if (obj.event === 'add') {  // 监听添加操作
            var index = layer.open({
                title: '添加用户',
                type: 2,
                shade: 0.2,
                maxmin: true,
                shadeClose: true,
                area: ['100%', '100%'],
                content: 'page/table/add.html',
            });
            $(window).on("resize", function () {
                layer.full(index);
            });
        } else if (obj.event === 'delete') {  // 监听删除操作
            var checkStatus = table.checkStatus('currentTableId')
                , data = checkStatus.data;
            layer.alert(JSON.stringify(data));
        }
    });


    table.on('tool(currentTableId)', function (obj) {
        var data = obj.data;
        console.log(data);
        var mid = getMid();
        var mrole = getMRole();
        if (obj.event === 'reset') {
            layer.confirm("确认要重置该用户的账户信息吗？", {
                btn: ['确定', '取消']
            }, function () {
                // 按钮1的事件
                $.ajax({
                    url: "/future/manager/reset/" + mid+"/"+mrole,
                    type: "POST",
                    data: JSON.stringify({
                        mid: data.mid,
                        mrole: data.mrole
                    }),
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    success(res) {
                        if (res.code == "10101") {
                            sessionStorage.setItem("manageInfo", null);
                            window.parent.location.reload();
                            return false;
                        }
                        layer.msg(res.message, {time: 2000});
                    }, error(err) {
                        layer.msg(err, {icon: 2, time: 3000});
                    }
                })
            }, function () {
                // 按钮2的事件
                layer.msg("您点击了取消");
            });
        } else if (obj.event === 'delete') {
            layer.confirm('真的删除行么', function (index) {
                obj.del();
                layer.close(index);
            });
        }
    });
    form.on("select(mrole)", function () {
        vm.$data.mrole = $("#mrole").val();
    })
    form.on("select(login_success)", function () {
        vm.$data.login_success = $("#login_success").val();
    })
    form.render();
});